<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		<title>example</title>
		<link rel="stylesheet" type="text/css" href="../build/bootstrap/css/bootstrap.css" />
		<script src="../build/jquery/jquery-3.0.0.js" type="text/javascript" charset="utf-8"></script>
		<script src="../build/bootstrap/js/bootstrap.js" type="text/javascript" charset="utf-8"></script>
		<style type="text/css">

		</style>
	</head>

	<body>
		<div class="container">
			<div class="input-group">
				<span class="input-group-addon" id="basic-addon1">@</span>
				<input type="text" class="form-control" placeholder="Username" aria-describedby="basic-addon1">
			</div>

			<div class="input-group">
				<input type="text" class="form-control" placeholder="Recipient's username" aria-describedby="basic-addon2">
				<span class="input-group-addon" id="basic-addon2">@example.com</span>
			</div>

			<div class="input-group">
				<span class="input-group-addon">$</span>
				<input type="text" class="form-control" aria-label="Amount (to the nearest dollar)">
				<span class="input-group-addon">.00</span>
			</div>

			<label for="basic-url">Your vanity URL</label>
			<div class="input-group">
				<span class="input-group-addon" id="basic-addon3">https://example.com/users/</span>
				<input type="text" class="form-control" id="basic-url" aria-describedby="basic-addon3">
			</div>
			<div class="input-group input-group-lg">
				<span class="input-group-addon" id="sizing-addon1">@</span>
				<input type="text" class="form-control" placeholder="Username" aria-describedby="sizing-addon1">
			</div>

			<div class="input-group">
				<span class="input-group-addon" id="sizing-addon2">@</span>
				<input type="text" class="form-control" placeholder="Username" aria-describedby="sizing-addon2">
			</div>

			<div class="input-group input-group-sm">
				<span class="input-group-addon" id="sizing-addon3">@</span>
				<input type="text" class="form-control" placeholder="Username" aria-describedby="sizing-addon3">
			</div>
			<div class="row">
				<div class="col-lg-6">
					<div class="input-group">
						<span class="input-group-addon">
        <input type="checkbox" aria-label="...">
      </span>
						<input type="text" class="form-control" aria-label="...">
					</div>
					<!-- /input-group -->
				</div>
				<!-- /.col-lg-6 -->
				<div class="col-lg-6">
					<div class="input-group">
						<span class="input-group-addon">
        <input type="radio" aria-label="...">
      </span>
						<input type="text" class="form-control" aria-label="...">
					</div>
					<!-- /input-group -->
				</div>
				<!-- /.col-lg-6 -->
			</div>
			<!-- /.row -->
			<hr />
			<div class="row">
				<div class="col-lg-6">
					<div class="input-group">
						<span class="input-group-btn">
        <button class="btn btn-default" type="button">Go!</button>
      </span>
						<input type="text" class="form-control" placeholder="Search for...">
					</div>
					<!-- /input-group -->
				</div>
				<!-- /.col-lg-6 -->
				<div class="col-lg-6">
					<div class="input-group">
						<input type="text" class="form-control" placeholder="Search for...">
						<span class="input-group-btn">
        <button class="btn btn-default" type="button">Go!</button>
      </span>
					</div>
					<!-- /input-group -->
				</div>
				<!-- /.col-lg-6 -->
			</div>
			<!-- /.row -->
			<hr />
			<div class="row">
				<div class="col-lg-6">
					<div class="input-group">
						<div class="input-group-btn">
							<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Action <span class="caret"></span></button>
							<ul class="dropdown-menu">
								<li>
									<a href="#">Action</a>
								</li>
								<li>
									<a href="#">Another action</a>
								</li>
								<li>
									<a href="#">Something else here</a>
								</li>
								<li role="separator" class="divider"></li>
								<li>
									<a href="#">Separated link</a>
								</li>
							</ul>
						</div>
						<!-- /btn-group -->
						<input type="text" class="form-control" aria-label="...">
					</div>
					<!-- /input-group -->
				</div>
				<!-- /.col-lg-6 -->
				<div class="col-lg-6">
					<div class="input-group">
						<input type="text" class="form-control" aria-label="...">
						<div class="input-group-btn">
							<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Action <span class="caret"></span></button>
							<ul class="dropdown-menu dropdown-menu-right">
								<li>
									<a href="#">Action</a>
								</li>
								<li>
									<a href="#">Another action</a>
								</li>
								<li>
									<a href="#">Something else here</a>
								</li>
								<li role="separator" class="divider"></li>
								<li>
									<a href="#">Separated link</a>
								</li>
							</ul>
						</div>
						<!-- /btn-group -->
					</div>
					<!-- /input-group -->
				</div>
				<!-- /.col-lg-6 -->
			</div>
			<!-- /.row -->
			<div class="row">
				<div class="col-lg-6">
					<div class="input-group">
						<div class="input-group-btn">
							<button type="button" class="btn btn-default">Action</button>
							<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
              <span class="caret"></span>
              <span class="sr-only">Toggle Dropdown</span>
            </button>
							<ul class="dropdown-menu">
								<li>
									<a href="#">Action</a>
								</li>
								<li>
									<a href="#">Another action</a>
								</li>
								<li>
									<a href="#">Something else here</a>
								</li>
								<li role="separator" class="divider"></li>
								<li>
									<a href="#">Separated link</a>
								</li>
							</ul>
						</div>
						<input type="text" class="form-control" aria-label="Text input with segmented button dropdown">
					</div>
					<!-- /.input-group -->
				</div>
				<!-- /.col-lg-6 -->
				<div class="col-lg-6">
					<div class="input-group">
						<input type="text" class="form-control" aria-label="Text input with segmented button dropdown">
						<div class="input-group-btn">
							<button type="button" class="btn btn-default">Action</button>
							<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
              <span class="caret"></span>
              <span class="sr-only">Toggle Dropdown</span>
            </button>
							<ul class="dropdown-menu dropdown-menu-right">
								<li>
									<a href="#">Action</a>
								</li>
								<li>
									<a href="#">Another action</a>
								</li>
								<li>
									<a href="#">Something else here</a>
								</li>
								<li role="separator" class="divider"></li>
								<li>
									<a href="#">Separated link</a>
								</li>
							</ul>
						</div>
					</div>
					<!-- /.input-group -->
				</div>
				<!-- /.col-lg-6 -->
			</div>
			<div class="row">
				<div class="col-lg-6">
					<div class="input-group">
						<div class="input-group-btn">
							<button type="button" class="btn btn-default" aria-label="Bold"><span class="glyphicon glyphicon-bold"></span></button>
							<button type="button" class="btn btn-default" aria-label="Italic"><span class="glyphicon glyphicon-italic"></span></button>
							<button type="button" class="btn btn-default" aria-label="alert"><span class="glyphicon glyphicon-alert"></span></button>
						</div>
						<input type="text" class="form-control" aria-label="Text input with multiple buttons">
					</div>
					<!-- /.input-group -->
				</div>
				<!-- /.col-lg-6 -->
				<div class="col-lg-6">
					<div class="input-group">
						<input type="text" class="form-control" aria-label="Text input with multiple buttons">
						<div class="input-group-btn">
							<button type="button" class="btn btn-default" aria-label="Help"><span class="glyphicon glyphicon-question-sign"></span></button>
							<button type="button" class="btn btn-default">Action</button>
						</div>
					</div>
					<!-- /.input-group -->
				</div>
				<!-- /.col-lg-6 -->
			</div>
		</div>
	</body>

</html>